<template >
  <div ref="tag" class="app">
    <keep-alive>
      <!-- 首页头部公共--开始 -->
      <div class="top">
        <top></top>
      </div>
      <!-- 首页头部公共--结束 -->
    </keep-alive>
    <!-- <el-container class="infoApp"> -->
    <router-view />
    <!-- </el-container> -->
    <keep-alive>
      <!-- 首页底部公共--开始 -->
      <div class="foot">
        <!-- <el-container> -->
        <foot class="nav"></foot>
        <!-- </el-container> -->
      </div>
      <!-- 首页底部公共--结束 -->
    </keep-alive>
  </div>
</template>
	
<script>
import top from "@/components/newHome/top.vue";
import foot from "@/components/home/foot.vue";

export default {
  data: function () {
    return {
      transitionName: "",
    };
  },
  methods: {},
  components: {
    top: top,
    foot: foot,
  },
  // beforeCreate() {
  //   console.log(process.env.VUE_APP_MODE)
  //   if ((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i))) {
  //     window.location.href = 'https://mdev.fishnovel.com/'; //https://m.fishnovel.com/
  //   } else {
  //     window.location.href = 'https://fishnoveldevpc.fishnovel.com/'; //https://web.fishnovel.com/
  //   }
  // },
  mounted() {},
};
</script>
<style lang="scss" scoped="scoped">
.app {
  background-color: #000;
  //   display: flex;
  //   width: 100%;
  //   background-color: #000;
  //   // overflow: hidden;
  //   flex-direction: column;
  .top {
    position: fixed;
    top: 0;
    width: 100%;
    background: #000;
    // margin-bottom: 20px;
    z-index: 110;
    .nav {
      width: 1200px;
      margin: 0 auto;
    }
  }
  .infoApp {
    width: 1200px;
    margin: 0 auto;
    background-color: #000;
  }
  .foot {
    background: #000;
    width: 100%;
    position: relative;
    .nav {
      width: 1200px;
      margin: 0 auto;
      background: #000;
    }
  }
}
.slide-left-enter,
.slide-right-leave-to {
  opacity: 0;
  transform: translateX(100%);
}

.slide-left-leave-to,
.slide-right-enter {
  opacity: 0;
  transform: translateX(-100%);
}

.slide-left-enter-active,
.slide-left-leave-active,
.slide-right-enter-active,
.slide-right-leave-active {
  transition: 1.5s;
  position: absolute;
  top: 0;
}
</style>